<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>ingress详情</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="/css/public.css" media="all">
    <script src="/lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
    <script src="/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
    <script src="/js/xkube.js?v=1" charset="utf-8"></script>

</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
            <fieldset class="layui-elem-field layui-field-title" style="margin-top: 10px;">
                <legend>基本信息</legend>
            </fieldset>  

              <button class="layui-btn" id="EditYamlBtn">yaml编辑</button>
              <button class="layui-btn" id="YamlBackup">yaml备份</button>
              <button class="layui-btn layui-btn-danger" id="DelBtn">删除</button>

              <br><br>

              <blockquote class="layui-elem-quote layui-quote-nm">
                  <table class="layui-table" lay-even="" lay-size="lm">
                    <colgroup>
                      <col width="150">
                      <col width="400">
                      <col width="150">
                      <col>
                    </colgroup>
                    <tbody>
                      <tr>
                        <td>名称:</td>
                        <td><div id="appNameTitle"></div></td>
                        <td>端点:</td>
                        <td><div id="endpoint"></div></td>
                      </tr>
                      <tr>
                        <td>命名空间:</td>
                        <td><div id="nameSpace"></div></td>
                        <td>创建时间:</td>
                        <td><div id="createTime"></div></td>
                      </tr>
                      <tr>
                        <td>注解:</td>
                        <td><div id="annotations"></div></td>
                        <td>标签:</td>
                        <td><div id="labels"></div></td>
                      </tr>
                    </tbody>
                  </table> 
              </blockquote> 

            <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
                <legend>其他</legend>
            </fieldset>

              <div class="layui-tab">
                <ul class="layui-tab-title">
                  <li class="layui-this">规则</li>
                  <li>事件</li>
                </ul>
                <div class="layui-tab-content">
                  <div class="layui-tab-item layui-show">
                    <table class="layui-table" id="currentTableId" lay-filter="currentTableFilter"></table>
                  </div>
                  <div class="layui-tab-item">
                    <table class="layui-table" id="currentTableIdEvent" lay-filter="currentTableFilterEvent"></table>
                  </div>
                </div>
              </div>
    </div>
</div>
</body>

<script>

SetDefaultCluster();
var clusterId = getQueryString("clusterId");
if (clusterId == null) {
	clusterId = getCookie("clusterId")
}

var Apiver = "v1";
var clusterIdVersion = getCookie(clusterId);
if ( compareVersions("1.20.1",clusterIdVersion) == 1 ) {
  Apiver = "v1beta1";
}

    layui.use(['form', 'table','miniTab'], function () {
        var $ = layui.jquery,
            form = layui.form,
            table = layui.table;
            miniTab = layui.miniTab,
            miniTab.listen();

        //选择集群
        form.on('select(cluster_Id)', function(data){
          //console.log(data.elem); //得到select原始DOM对象
          console.log(data.value); //得到被选中的值
          setCookie('clusterId',data.value,30);
          window.location.reload();
          //console.log(data.othis); //得到美化后的DOM对象
        });

        var ingressName = getQueryString("ingressName");
        $('#appNameTitle').html(ingressName);

        $('#EditYamlBtn').on("click",function(){
                layer.open({
                    title: 'yaml',
                    type: 2,
                    shade: 0.2,
                    maxmin:true,
                    shadeClose: true,
                    area: ['45%', '92%'],
                    content: '/page/xkube/ingressYaml.html'+location.search,
                });
        });

        $('#YamlBackup').on("click",function(){
              miniTab.openNewTabByIframe({
                  href:'page/xkube/yamlBackup.html'+location.search+"&resType=ingress"+"&resName="+ingressName,
                  title:ingressName+"备份",
              }); 
        });

        $('#DelBtn').on("click",function(){
            layer.confirm('确定删除'+ingressName+'?', {icon: 3, title:'提示',yes: function(index){
        			  $.ajax({
        			   url: "/xkube/ing/"+Apiver+"/Del"+location.search,
        			   type: "GET",
                 data: JSON.stringify(bodystr),
                 dataType: "json",
        			   success: function (resp) {
        					  if (resp.code == 0 ) {
                      layer.msg('删除成功', {icon: 1});
                    }else{
                      layer.msg(resp.msg,{icon:2});
                    }
        				  }
        		    });
              },
              cancel: function(index, layero){ 
                    layer.close(index);
              } 
            });
        });        

        //detai详细
        $.get('/xkube/ing/'+Apiver+'/Detail' + location.search, function (resp) {
  				  if (resp.ingressName != '' ) {
                //console.log(resp);
                //详细信息
                var ingressName = resp.ingressName;
                $('#ingressName').html(ingressName);
  
                var createTime = resp.createTime;
                $('#createTime').html(createTime);
  
                var nameSpace = resp.nameSpace;
                $('#nameSpace').html(nameSpace);
  
                var annotations = resp.annotations;
                $('#annotations').html(annotations);
  
                var labels = resp.labels;
                $('#labels').html(labels);
  
                var endpoint = resp.endpoint;
                $('#endpoint').html(endpoint);
                //conditions
                table.render({
                    elem: '#currentTableId',
                    cols: [[
                        {field: 'host',title: '域名'},
                        {field: 'pathType',title: '路径类型'},
                        {field: 'path', title: '路径'},      
                        {field: 'serviceName',title: '服务名称'},                          
                        {field: 'servicePort',title: '服务端口'},
                    ]],
                    data: resp.rules,
                    even: true,
                    limits: [30, 60, 100],
                    limit: 30,
                    page: true
                });


          }else{
            layer.msg('请重新刷新',{icon:2});
          }
		    });

        //事件列表
        table.render({
            elem: '#currentTableIdEvent',
            //url: '/xkube/event/v1/List' + location.search+"&kind=Ingress&objName="+ingressName,
            url: '/xkube/event/v1/List' + location.search+"&kind=Pod",
            //toolbar: '#toolbarDemo',
            //editTrigger: 'dblclick',
            //defaultToolbar: ['filter'],
            cols: [[
                {field: 'eventType', width: 130,title: '类型', sort: true},
                {field: 'kind', width: 120,title: '对象', sort: true},
                {field: 'objName', width: 180,title: '名称', sort: true},                                
                {field: 'message',title: '消息', sort: true},
                {field: 'reason', title: '原因',width: 200, sort: true},
                {field: 'createTime', width:180, title: '创建时间',hide:true},
            ]],
            limits: [25, 50, 100],
            limit: 15,
            page: false
        });

    });
</script>
</html>